 /**
 *  @description 对象属性编辑器，以列表的形式 编辑json对象
 */
Rsd.define('Rsd.tool.PropertiesEditor', {
    extend: 'Rsd.container.Dialog',
    requires: [
        'Rsd.control.Grid',
        'Rsd.form.Label',
        'Rsd.form.Button'
    ],
    xtype: 'properties-editor',
    title:'属性编辑器',
    width:800,
    //height:500,
    layout:'vbox',
    items: [
        {
            xtype:'grid',
            readonly:false,
            label:false,
            border:false,
            width:'100%',
            overflow:'auto',
            style:{backgroundColor:'rgba(255, 255, 255, 0.25)'},
            columns:[
                {text:'名称',width:120,dataIndex:'name'},
                {text:'值',width:'60%',dataIndex:'value',editable:true},
                {dataIndex:'op',width:'10%'}
            ], 
            /**
             * 通过rowdblclick实现自定义编辑
            */
            rowdblclick:'pr_rowdblclick', 
            /**
             * 通过rowclick实现自定义编辑
             */
            rowclick:'pr_rowdblclick', 
            /**
             * change 事件
             */
            onChanged:null,
            flex:1
        },
        {
            xtype:'container',
            height:70,
            items:
            [
                {
                    xtype:'button',
                    height:40,
                    width:120,
                    text:'保 存',
                    handler:function(){
                        this.parent.parent.close();
                    }
                }
            ]
        }
    ],
    /**
     * 
     * @param {*} config 
     */
    constructor: function JsonEditor(config) {
        config = config || {};
        this.apply(config); 
    },
    /*
    * */
    load:function load(json) {
 
        this.data = json||this.data||{}; 
        //console.log(this.data);
        var _grid = this.items[0];
        var list = this.getProperties(this.data);
        var _sort_list = list.sort(function(a,b){return a.name.localeCompare(b.name);});
        _grid.loadData(_sort_list);
    },
    /**
     * 
     */
    getProperties:function getProperties(data)
    {
        var arr = [];
        for (var i in data) {
            if(i.startsWith('__'))
            {
                continue;
            }
            var _c = data[i];
             if(Rsd.isFunction(_c))
             {
                continue;
             }
            var _r = {name: i, value: data[i], op: '...'};
            
            if(Rsd.isType(_c,HTMLDocument))
            {
                _r['op'] = '';
            }
            if (_c instanceof Element) {
                _r['op'] = '';
            }
            if (_c instanceof Rsd.common.ComponentX) {
                _r['op'] = '';
            }
            if (i == 'id') {
                _r['op'] = '';
            }
            if (i == 'xtype') {
                _r['op'] = '';
            }
            if (i == 'parent') {
                _r['op'] = '';
            }
            if (i == '$className') {
                _r['op'] = '';
            }
            arr.push(_r);

        }
        return arr;
    },
     /**
         * 
         * @param {*} row 
         * @param {*} data 
         */
    pr_rowdblclick:function pr_rowdblclick(row,data) {
        var me = this;
        var grid = this.items[0];
        var rowIndex = data.rowIndex;
        //console.log(row),console.log(data);
        if(row['___edit']===false)
        {
            return;
        }
        if(row['value'] instanceof  Element)
        {
            return;
        }
       
        if(Rsd.isObject(row['value']))
        {
            Rsd.create(me.$className,{
                parent:me,
                width:'80%',
                height:'80%',
                data:row['value']
            }).showDialog();

            return;

        }
       if(Rsd.isArray(row['value']))
       {
            Rsd.create(me.$className,{
                parent:me,
                width:'80%',
                height:'80%',
                data:row['value']
            }).showDialog();

            return;
       }
        {
            grid.editRow(rowIndex, true,1,Rsd.widget(row['xtype']||'text',{
                //margin:'3 5 3 5',
                width:'100%',
                height:'90%',
                name:row['name'],
                textChanged:function (sender,event) {
                
                    me.data[sender.name] = sender.getValue();
                    me.funApplyByIOC(me.onChanged,[me.data])

                },
            }));
        }
    }

});
